<template>
  <div id="a" v-if="viewModel">
    <div class="zk-aritcle-detail">
      <div class="container_box">
        <el-container>
          <el-main>
            <div v-if="viewModelList.image"><img :src="api+viewModelList.image" class="detail_img"></div>
            <h1 class="entry-title fusion-post-title" v-if="viewModelList">{{viewModelList.title}}</h1>
            <div class="fusion-column-wrapper" style="background-position:left top;background-repeat:no-repeat;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover;" data-bg-url="">
              <div class="" v-if="viewModelList.content">
                <p v-html="viewModelList.content"></p>
              </div>
            </div>
            <div class="fusion-text" v-if="viewModelList.content">
              <h3 data-fontsize="16" data-lineheight="30" style="color:#2b2e32;font-size:16px;margin:25px 0">{{viewModelList.author}}</h3>
            </div>
          </el-main>
        </el-container>
      </div>
    </div>
  </div>
</template>

<script>
  import './var.scss'
  import './styles'


  import ala from 'ala'
export default {

    props: {
      widgetData: {},
      viewModel: {},
      widget: {}
    },
    data () {
      return {
        widgetModel: {},
        contentList: null,
        content: null,
        api: '',
        async: false

      }
    },
    mounted () {
      this.init()
    },
    methods: {
      async init () {
        this.async = true
        // $ala.host
        this.api = 'http://b-open.qiniuniu99.com'
      }
    }
  }
</script>
<style  lang="scss" scoped>
  @import "./styles/a.scss";
</style>
